<!DOCTYPE html>
<html lang="en">
<head>
    <title>Portland Farmers Market</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!--meta data for sharing links on Facebook-->
    <meta property="og:title" content="Portland Farmers Market"/>
    <meta property="og:url" content="https://github.com/garciahan/StoryMap/blob/master/index_map.html"/>
    <meta property="og:description" content="This is an example of a storymap."/>
    <meta property="og:image" content="images/social.png"/>

    <!--add required stylesheets-->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
    <!--leaflet css-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.4.0/leaflet.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

    <!--add favicon for the web page-->
    <link rel="shortcut icon" href="images/bridge.png" type="image/x-icon">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css">

    <!--Font-->
    <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">

    <link rel="stylesheet" type="text/css" href="dist/storymap.2.5.css">

    <!--add required libraries-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.4.0/leaflet.js"></script>
    <!--jquery and Popper-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>

    <!--boostrap-->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <!--leaflet.ajax for asynchronously adding geojson data-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-ajax/2.1.0/leaflet.ajax.min.js"></script>

    <!--story map plugin-->
    <script src="dist/storymap.2.5.js"></script>
<style>
h2 {
  text-align: center;
}
</style>
</head>
<body>
<!-- <div id= "map"></div> -->
<div id="storymap" class="container-fluid">
    <div class="row">
        <div class="col-sm-6 col-md-8 storymap-map"></div>
        <div class="col-sm-6 col-md-4 storymap-story">

            <section data-scene="scene1">
              <p><h1>Portland Farmers Market</h1></p>
              <p><h2><small style="color: rgb(72, 76, 75)">Geovisual map of farmers market in Porland, Oregon</small></h2></p></section>

            <section data-scene="scene2">
              <h2><b>Hillsdale Farmers Market</b></h2>
              <img src="images/hillsdale.jpg" class="img-responsive" alt="responsive image" alt-text="Hillsdale">
              <p><font size="0.25">Image from <a href="http://www.hillsdalefarmersmarket.com/">Hillsdale farmers market website<a/></font></p>
              <font size = 3><b>HOURS & OPENINGS</b>
              <p>March 3, 17, 31 & April 14, Sundays, 9am – 1pm</p>
              <p>Then weekly from April 28 through November 28</p>
              <p>Winter, December 8 2019 to April 5 2020, 9am – 1pm</p>
              <p><b>PAYMENTS ACCEPTED</b></p>
              <p>EBT, credit & debit cards, cash & up to $10 with SNAP</p>
              <p><b>CONTACT & INFO</b></p>
              <p>Number (503) 475-6555</p>
              <p><a href="www.hillsdalefarmersmarket.com">Website</a></p></font>
            </section>

            <section data-scene="scene3">
            <h2><b>Hollywood Farmers Market</b></h2>
            <img src="images/hollywood.jpg" class="img-responsive" alt="responsive image" alt-text="Hollywood" style="width:780px;height:510px;">
            <p><font size="0.25">Image from  <a href="https://hollywoodpdx.com/2017/03/08/creditdebit-ebt-double-up-food-bucks-wic-and-senior-coupons/">hollywoodpdx.com</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>April to September,  Saturdays, 8am – 1pm</p>
            <p>October to November, Saturdays, 9am – 1pm</p>
            <p>December to March, 1st and 3rd Saturdays, 9am – 1pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash, up to $10 with SNAP & FDNP</p>
            <p><b>CONTACT & INFO</b></p>
            <p>Number (503) 709-7403</p>
            <p><a href="http://hollywoodfarmersmarket.org/">Website</a></p></font>
            </section>

            <section data-scene="scene4">
            <h2><b>Montavilla Farmers Market</b></h2>
            <img src="images/montaville.jpg" class="img-responsive" alt="responsive image" alt-text="Montaville" style="width:780px;height:510px;">
            <p><font size="0.25">Image from Montavilla farmers market <a href="http://www.montavillamarket.org/about/history/">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>May to October, Sundays, 10am - 2 pm</p>
            <p>Winter, November 18, December 23, January 13 and Febuary 10, 10am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>EBT, credit & debit cards, cash & SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p><a href="http://montavillamarket.org">Website</a></p></font>
            </section>

            <section data-scene="scene5">
            <h2><b>Moreland Farmers Market</b></h2>
            <img src="images/moreland.jfif" class="img-responsive" alt="responsive image" alt-text="Moreland" style="width:697px;height:520px;">
            <p><font size="0.25">Image from  Moreland farmers market <a href="http://www.morelandfarmersmarket.org/market-day">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>May to October, Wednesdays 2pm - 7pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash & $5 - $10 with SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p>Number (503) 341-9350</p>
            <p><a href="http://morelandfarmersmarket.org">Website</a></p></font>
            </section>

            <section data-scene="scene6">
            <h2><b>People's Farmers Market</b></h2>
            <img src="images/peoples.jpg" class="img-responsive" alt="responsive image" alt-text="Peoples" style="width:795px;height:510px;">
            <p><font size="0.25">Image from  Peoples coop <a href="https://www.peoples.coop/farmers-market">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>Year round, Wednesdays, 2pm - 7 pm</p>
            <p>There is a co-op store open daily from 8am - 9 pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash & up to $5 with SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p>Number  (503) 328-0000</p>
            <p><a href="https://www.peoples.coop/farmers-market">Website</a></p></font>
            </section>

            <section data-scene="scene7">
            <h2><b>Portland Farmers Market at Portland State University</b></h2>
            <img src="images/psu.png" class="img-responsive" alt="responsive image" alt-text="PSU" style="width:780px;height:510px;">
            <p><font size="0.25">Image from <a href="https://www.biketownpdx.com/attractions/portland-farmers-market-portland-state-university">biketoenpdx.com</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>Year round, Saturdays, 8:30am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash & SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p><a href="https://www.pdx.edu/insidepsu/portland-farmers-market-at-psu">Website</a></p></font>
            </section>

            <section data-scene="scene8">
            <h2><b>Lents International Farmers Market</b></h2>
            <img src="images/lents.jpg" class="img-responsive" alt="responsive image" alt-text="Lents" style="width:730px;height:510px;">
            <p><font size="0.25">Image from Portland Farmers Market  <a href="http://www.portlandfarmersmarket.org/our-markets/lents-international/">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>June to November, Sundays, 9am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash & up to $10 with SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p><a href="http://www.portlandfarmersmarket.org/our-markets/lents-international/">Website</a></p></font>
            </section>

            <section data-scene="scene9">
            <h2><b>Lloyd Farmers Market</b></h2>
            <img src="images/lloyd.jpg" class="img-responsive" alt="responsive image" alt-text="lloyd" style="width:750px;height:510px;">
            <p><font size="0.25">Image from Lloyd farmers market <a href="https://lloydfarmersmkt.net/">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>Year round, Tuesdays, 10am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash, SNAP & FDNP</p>
            <p><b>CONTACT & INFO</b></p>
            <p><a href="https://lloydfarmersmkt.net/">Website</a></p></font>
            </section>

            <section data-scene="scene10">
            <h2><b>OHSU Farmers Market</b></h2>
            <img src="images/ohsu.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:780px;height:510px;">
            <p><font size="0.25">Image teken by employer at OHSU, <a href="https://www.glassdoor.com/Photos/OHSU-Office-Photos-IMG56347.htm">link here</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>June to September, Tuesdays, 10am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash, SNAP & up to $5 with FDNP</p>
            <p><b>CONTACT & INFO</b></p>
            <p><a href="https://www.ohsu.edu/xd/about/services/food-and-nutrition/farmers-market/">Website</a></p></font>
            </section>

            <section data-scene="scene11">
            <h2><b>King Portland Farmers Market</b></h2>
            <img src="images/king.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:750px;height:51]0px;">
            <p><font size="0.25">Image from King farmers market <a href="http://www.portlandfarmersmarket.org/our-markets/king/">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>May to November, Sundays, 10am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash & up to $10 with SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p>Number (503) 241-0032</p>
            <p><a href="http://www.portlandfarmersmarket.org/our-markets/king/">Website</a></p></font>
            </section>

            <section data-scene="scene12">
            <h2><b>St Johns Farmers Market</b></h2>
            <img src="images/stjohns.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:780px;height:510px;">
            <p><font size="0.25">Image from St. Johns opportunity <a href="http://www.stjohnsopportunity.org/community-calendar/2018/5/19/opening-day-of-the-st-johns-farmers-market">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>May - October, Saturdays, 9am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash & up to $10 with SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p>Number (503) 841-5522</p>
            <p><a href="http://www.stjohnsopportunity.org/stjohnsfarmersmarket">Website</a></p></font>
            </section>

            <section data-scene="scene13">
            <h2><b>Portland Farmers Market at Pioneer Courthouse Square</b></h2>
            <img src="images/pcts.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:780px;height:470px;">
            <p><font size="0.25">Image from Pioneer Courthouse Square <a href="https://thesquarepdx.org/events/sponsor-an-event/">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>Well known amoung Portland natives and touist. The farmers market at Pioneer Courthouse Square will not be reopened for the 2019 year.
            Look at website for future reopnening or changes in schedule.</p>
            <p><a href="http://www.portlandfarmersmarket.org/our-markets/pioneer-courthouse-square/">Website</a></p></font>
            </section>

            <section data-scene="scene14">
            <h2><b>Cully Farmers Market</b></h2>
            <img src="images/cully.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:780px;height:510px;">
            <p><font size="0.25">Image from Cully farmers market <a href="www.cullyfarmersmarket.org">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>June - September, Thursdays, 4pm - 8pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Cash & up to $10 with SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p>Number (503) 912-8936</p>
            <p><a href="http://cullyfarmersmarket.org">Website</a></p></font>
            </section>

            <section data-scene="scene15">
            <h2><b>Woodstock Farmers Market</b></h2>
            <img src="images/woodstock.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:750px;height:510px;">
            <p><font size="0.25">Image from Local Harvest <a href="https://www.localharvest.org/woodstock-farmers-market-M2081">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>June - October, Sundays, 10am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash, SNAP & FDNP</p>
            <p><b>CONTACT & INFO</b></p>
            <p>Number (971) 208-5522</p>
            <p><a href="https://woodstockmarketpdx.com/">Website</a></p></font>
            </section>

            <section data-scene="scene16">
            <h2><b>South Waterfront Farmers Market</b></h2>
            <img src="images/south.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:780px;height:510px;">
            <p><font size="0.25">Image from South Portland Buisness Association <a href="">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>June to October, Thursday, 2pm - 7pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash, SNAP & FDNP</p>
            <p><b>CONTACT & INFO</b></p>
            <p>Number (503) 972-3289</p>
            <p><a href="http://southwaterfront.com/farmers-market">Website</a></p></font>
            </section>

            <section data-scene="scene17">
            <h2><b>Kenton Portland Farmers Market</b></h2>
            <img src="images/kenton.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:780px;height:510px;">
            <p><font size="0.25">Image from The Business Journals <a href="https://www.bizjournals.com/portland/news/2012/04/04/portland-farmers-market-adds-kenton-site.html">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>Junt to Septermber, Wednesdays, 3pm - 7pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>redit & debit cards, cash & up to $10 with SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p><a href="http://www.portlandfarmersmarket.org/our-markets/kenton/">Website</a></p></font>
            </section>

            <section data-scene="scene18">
            <h2><b>Portland Farmers Market at Shemanski Park</b></h2>
            <img src="images/shemanski.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:710px;height:510px;">
            <p><font size="0.25">Image from  FOURSQUARE <a href="https://foursquare.com/v/portland-farmers-market-at-shemanski-park/4ba6e1e5f964a5204a7539e3/photos">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>May to October, Wedndesdays, 10am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash & SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p><a href="http://www.portlandfarmersmarket.org/our-markets/shemanski-park/">Website</a></p></font>

            </section>

            <section data-scene="scene19">
            <h2><b>Woodlawn Neighborhood Farmers Market</b></h2>
            <img src="images/woodland.jpg" class="img-responsive" alt="responsive image" alt-text="" style="width:780px;height:510px;">
            <p><font size="0.25">Image from  Pinterst<a href="https://www.pinterest.com/pin/166773992436871219/">website</a></font></p>
            <font size = 3><b>HOURS & OPENINGS</b>
            <p>May - October, Saturdays, 10am - 2pm</p>
            <p><b>PAYMENTS ACCEPTED</b></p>
            <p>Credit & debit cards, cash & SNAP</p>
            <p><b>CONTACT & INFO</b></p>
            <p><a href="http://woodlawnfarmersmarket.org">Website</a></p></font>
            </section>

            <section data-scene="end" data-background="images/farmersmarket.jpg">
                <div class="fullscreen text-center">
                    <h1 class="display-4 d-flex justify-content-center"><font color="white">Thanks for viewing!</font></h1>
                </div>
            </section>

        </div>
        </div>
        </div>
                <!--facebook icon-->
                <a class="fab fa-facebook-square btn" href="https://www.facebook.com/sharer/sharer.php?u=garciahan.github.io/StoryMap/index_map.html" target="_blank"></a>
                <!--github icon-->
                <a class="fab fa-github btn" href="https://github.com/garciahan/StoryMap" style="top:40px"
                   target="_blank"></a>
                <!--info icon-->
                <i class="fas fa-info-circle btn" style="top:60px" data-toggle="modal" data-target="#info-modal"></i>

        <!--the info page-->
        <div class="modal fade" id="info-modal" role="dialog">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                      <h4 class="modal-title">About</h4>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <div class="modal-body">
                      <p>This storymap is an overview of farmers markets located in Portland, Oregon. Each page features one of the 17 locations
                        including information about hours & days open, accepted currency and contact information. For more information about directions, ventors or interested in working or
                        volunteering for the farmers market please visit the market wesite which are included in the slides.</p>
                        <p><font size:"12">Geospatial data is credited to <a href="https://www.portlandoregon.gov/28130">The City of Portland</a>, other data about farmers markets
                          was fount at <a href="http://www.portlandfarmersmarket.org/">the Portland farmers market website.</a></p>
                        <p>Carrot Icon by <a href="https://www.flaticon.com/authors/smashicons">Smashicons</a></p>
                        <p>Bridge Icon by PJ Souders from the <a href="https://thenounproject.com/term/portland/10120/"> Noun Project</a></p>
                        <p>Information, GitHub & Facebook icon fount at <a href="https://fontawesome.com/icons?d=gallery"> font awesome</a></p>
                        <p>Heart icon from <a href="https://material.io/tools/icons/?style=baseline">Material Design</a></p>
                        <p><b>storymap.js</b> | Released Date: 02/20/2017 | Version: 2.5 | MIT License </p>
                        <p><b>Author: Hannah Garcia</b> | College of Earth, Ocean, Atmospheric Science | Oregon State University</p>
                    </div>
                </div>
            </div>
        </div>

//FACEBOOK/GIT

  <script type="text/javascript">

      var layers = {
          layer1: { layer: L.tileLayer('https://api.mapbox.com/styles/v1/garciaha/cjsaxmiaw0fo01fo4tjmcs3v1/tiles/256/{z}/{x}/{y}@2x?access_token=pk.eyJ1IjoiZ2FyY2lhaGEiLCJhIjoiY2pzMHV3NHdkMWJ5ZDQ5bW4yeTI3djJ4aSJ9.0i83y-pUEPXNAkTlmvEK0Q')}
        };

      var scenes = {
          scene1: {lat: 45.52247, lng: -122.69576, zoom:  13, layers: [layers.layer1], name: 'Portland Farmers Market' },
          scene2: {lat: 45.47806, lng: -122.69361, zoom:  18, layers: [layers.layer1], name: 'Hillsdale Farmers Market'},
          scene3: {lat: 45.53626, lng: -122.61741, zoom:  18, layers: [layers.layer1], name: 'Hollywood Farmers Market'},
          scene4: {lat: 45.51906, lng: -122.58446, zoom:  18, layers: [layers.layer1], name: 'Montavilla Farmers Market'},
          scene5: {lat: 45.47403, lng: -122.65152, zoom:  18, layers: [layers.layer1], name: 'Moreland Farmers Market'},
          scene6: {lat: 45.50073, lng: -122.64479, zoom:  18, layers: [layers.layer1], name: 'Peoples Farmers Market'},
          scene7: {lat: 45.51229, lng: -122.68528, zoom:  18, layers: [layers.layer1], name: 'Portland Farmers Market at Portland State University'},
          scene8: {lat: 45.48131, lng: -122.56852, zoom:  18, layers: [layers.layer1], name: 'Lents International Farmers Market'},
          scene9: {lat: 45.52977, lng: -122.65748, zoom:  18, layers: [layers.layer1], name: 'Lloyd Farmers Market'},
          scene10: {lat: 45.49960, lng: -122.68772, zoom: 18, layers: [layers.layer1], name: 'OHSU Farmers Market'},
          scene11: {lat: 45.55723, lng: -122.65877, zoom: 18, layers: [layers.layer1], name: 'King Portland Farmers Market'},
          scene12: {lat: 45.59002, lng: -122.75475, zoom: 18, layers: [layers.layer1], name: 'St Johns Farmers Market'},
          scene13: {lat: 45.51889, lng: -122.67934, zoom: 18, layers: [layers.layer1], name: 'Portland Farmers Market at Pioneer Courthouse Square'},
          scene14: {lat: 45.55913, lng: -122.62060, zoom: 18, layers: [layers.layer1], name: 'Cully Farmers Market'},
          scene15: {lat: 45.47879, lng: -122.61521, zoom: 18, layers: [layers.layer1], name: 'Woodstock Farmers Market'},
          scene16: {lat: 45.49711, lng: -122.67138, zoom: 18, layers: [layers.layer1], name: 'South Waterfront Farmers Market'},
          scene17: {lat: 45.58331, lng: -122.68649, zoom: 18, layers: [layers.layer1], name: 'Kenton Portland Farmers Market'},
          scene18: {lat: 45.51691, lng: -122.68235, zoom: 18, layers: [layers.layer1], name: 'Portland Farmers Market at Shemanski Park'},
          scene19: {lat: 45.57201, lng: -122.65677, zoom: 18, layers: [layers.layer1], name: 'Woodlawn Neighborhood Farmers Market'}
      };

      $('#storymap').storymap({
          scenes: scenes,
          baselayer: layers.layer1,
          legend: true,
          loader: true,
          flyto: true,
          credits:  "Data from City of Portland | Icon from flaticon.com by Smashicons | Rose Icon by  Mickey Godfrey from the Noun Project | Made by Hannah Garcia <i class='material-icons' style='color: pink; font-size: 10px;'>favorite</i>",
          scalebar: true,
          scrolldown: true,
          progressline: true,
          navwidget: true,

          createMap: function () {
              var map = L.map($(".storymap-map")[0], {zoomControl: false}).setView([45.536, -122.610], 13);
              return map;
          }
      });
</script>
</body>
</html>
